<template>
	<div class="wrap-y wrap-center viewHei">
		<div class="wrap-x box-show padding-tb-sm">
			<div class="wrap-y borderRadius margin-right-sm" style="width: 500px;">
				<img src="../assets/imgs/解说 .png" class="margin-left-sm" />
			</div>
			<div class="wrap-y borderRadius" style="width: 500px;">
				<div class="text-center font22 boderBottom text-black padding-bottom-sm">晚会管理员登录系统</div>
				<div class="margin-lr-xl wrap-y margin-top-xl boderBottom">
					<el-popover placement="right" title="提示" width="200" trigger="click" content="请输入您的账号">
						<el-input v-model="phonenumber" placeholder="请输入账号" class="margin-tb-sm" slot="reference" />
					</el-popover>
					<el-popover placement="right" title="提示" width="200" trigger="click" content="请输入您的密码">
						<el-input v-model="password" type="password" placeholder="请输入密码" slot="reference" />
					</el-popover>
					<el-button @click="login" type="primary"
						style="margin-top: 30px; font-size: 16px; background-color: #2979ff;">点击登陆</el-button>
				</div>
			</div>
		</div>
	</div>
	</div>
</template>
<script>
	import axios from "axios";
	export default {
		name: "login",
		data() {
			return {
				phonenumber: '',
				password: ''
			}
		},
		methods: {
			login() {
				if (this.phonenumber == '') {
					this.$message.error('手机号不能为空');
				} else if (this.password == '') {
					this.$message.error('密码不能为空');
				} else {
					axios.post("http://47.113.202.41:9091/admin/user/login", {
						phonenumber: this.phonenumber,
						password: this.password
					}).then(res => {
						if (res.data.code == 200) {
							localStorage.setItem('userData', JSON.stringify(res.data))
							localStorage.setItem('token', JSON.stringify(res.data.data.token))
							this.$message.success(res.data.msg);
							this.$router.push("/");
						} else {
							this.$message.error(res.data.msg);
						}
					})

				}
			}
		}
	}
</script>

<style scoped>
</style>